﻿@model List<DHQGHN.PM2.ViewModels.MappingArea_EnumViewModel>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
@{
    var grid = new WebGrid(canPage: true, rowsPerPage: 10, selectionFieldName: "selectedRow");
    if (Model.Count == 0)
    {
        grid.Bind(@Model, autoSortAndPage: false, rowCount: 0);
    }
    else
    {
        grid.Bind(@Model, autoSortAndPage: false, rowCount: Model[0].RECORD_COUNT);
    }
    grid.Pager(WebGridPagerModes.NextPrevious);
}
@functions{
    public string GetAntiForgeryToken()
    {
        string cookieToken, formToken;
        AntiForgery.GetTokens(null, out cookieToken, out formToken);
        return cookieToken + "," + formToken;
    }
}
<script>
    $(document).ready(function () {
        $('[data-toggle="tooltip"]').tooltip();
    })
    $('.grid-footer td a').click(function(){
        $('#MappingEnum').empty();
        $('div.pager').empty();
        $('#divLoading').show();
        var Code = $('#GROUP').val();
        if (Code != "-1") {
            $.ajax({
                url: $('.grid-footer td a').attr('href'),
                type: 'POST',
                datatype: 'json',
                headers: {
                    'VerificationToken': '@GetAntiForgeryToken()'
                },
                data: { GroupCode: Code },
                success: function (map) {
                    $('#gridContent').html(map);
                    $('#divLoading').hide();
                },
                error: function (ex) {
                    $('#divLoading').hide();
                    alert('Lỗi kỹ thuật.' + ex);
                }
            })
            return false;
        } else {
            $('#divLoading').hide();
            $('#mappingDiv').empty();
            $('#defaultDiv').show();
        }
    })
</script>
@if (Model.Count > 0)
{
    if (Model.First().RECORD_COUNT <= 10)
    {
        <script>
            $(document).ready(function () {
                $('.grid-footer').empty();
                $('#MappingEnumGrid').append('<tfoot><tr class = "grid-footer"><td colspan="8"></td></tr></tfoot>')
            })
        </script>
    }
    <script>
        $(document).ready(function () {
            $('.grid-footer td').append('<div style="float:right;">Đang xem ' + '@Model.First().ORDER' + ' - ' + '@Model.Last().ORDER' + ' trên ' + '@Model.First().RECORD_COUNT' + ' cán bộ</div>')
        })
    </script>
    @grid.GetHtml(tableStyle: "webGrid table table-striped table-bordered table-hover dataTable no-footer",
                    htmlAttributes: new { id = "MappingEnumGrid" },
                    headerStyle: "header",
                    alternatingRowStyle: "",
                    selectedRowStyle: "select",
                    rowStyle: "webgrid-row-style",
                    footerStyle: "grid-footer",
                    mode: WebGridPagerModes.All,
                    firstText: "|<<",
                    previousText: "|<",
                    nextText: ">|",
                    lastText: ">>|",
                    columns: grid.Columns(
                    grid.Column(
                        columnName: "STT",
                        header: "STT",
                        format: @<text>
                            <span id="spRowNum" class="display-mode">@item.ORDER</span>
                        </text>,
                        canSort: false,
                        style: "clsSTT"
                    ),
                    grid.Column(
                        columnName: "ID",
                        header: "ID",
                        format: @<text>
                            <span id="spRowNum" class="display-mode">@item.ENUMERATOR_ID</span>
                        </text>,
                        canSort: false
                    ),
                    grid.Column("FULL_NAME", "Tên cán bộ", format:
                    @<text>
                        <span id="spnAreaCode" class="display-mode">@item.FULL_NAME</span>
                    </text>,canSort: false, style: "clsAREA_CODE hidden-480"),

                    grid.Column("AREA_NAME", "Địa bàn được gán", format:
                    @<text>
                        <span id="spnAreaName" class="display-mode">@item.AREA_NAME</span>
                    </text>,canSort: false, style: "clsAREA_NAME "),
                    grid.Column("Thao tác", format:
                    @<text>
                        <div style="text-align:center;">
                            <a id="mapBtn" data-index="@item.GROUP" style="cursor:pointer;" data-toggle="tooltip" title="Phân công"><i class="fa fa-pencil"></i></a>
                        </div>
                    </text>, canSort: false, style: "clsAction")))
}
else
{
    <div align="center"><h4>Không tìm thấy kết quả nào phù hợp</h4></div>
}
